<template>
	<view class="price_container" :style="{color:color,fontWeight: weight ? '500':'normal'}">
		<text :style="{fontSize:smallSize}">￥</text>
		<text :style="{fontSize:bigSize}">{{leftNumber}}</text>
		<text :style="{fontSize:smallSize}" v-if="rightNumber !== ''">{{"." + rightNumber}}</text>
	</view>
</template>

<script>
	export default {
		name: "PriceFont",
		props: {
			bigSize: {
				type: String,
				default () {
					return "24rpx";
				}
			},
			smallSize: {
				type: String,
				default () {
					return "20rpx";
				}
			},
			color: {
				type: String,
				default () {
					return "#fff";
				}
			},
			price: {
				type: String || Number,
				required: true
			},
			weight:{
				type:Boolean,
				default(){
					return true
				}
			}
		},
		computed: {
			leftNumber() {
				return (this.price + '').split('.')[0];
			},
			rightNumber() {
				// 没有小数
				if(!(this.price + '').split('.')[1]) {
					return "00"
				} else {
					// 有小数
					let temp = (this.price + '').split('.')[1];
					if(temp.length < 2) {
						return temp + '0';
					} else {
						return temp
					}
				};
			}
		}
	}
</script>
<style>
.price_container{display: inline-block;}
</style>